<!DOCTYPE html>
<html lang="en" xmlns:sec="http://www.thymeleaf.org/extras/spring-security" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('发射机动态·')"/>
    <link rel="stylesheet" th:href="@{/admin/css/other/user.css}"/>
</head>
<body class="pear-container">
<div class="layui-col-md2">
    <div class="layui-card">
        <div class="layui-card-body">
            <div id="organizationTreeContent" style="overflow: auto">
                <ul id="dataTree" class="dtree organizationTree" data-id="0" ></ul>
            </div>
        </div>
    </div>
</div>
<div class="layui-col-md10">
    <div class="layui-card">
        <div class="layui-card-body">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>发射机列表</legend>
            </fieldset>
            <div class="layui-card-body">
                <div id="currentTableId"></div>
            </div>
        </div>
    </div>
    <div class="layui-card">
        <div class="layui-card-body">
            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                <legend>发射机告警信息</legend>
            </fieldset>
            <div class="layui-card-body">
                <table id="myTable" lay-filter="myTable"></table>
            </div>
        </div>
    </div>
</body>
<th:block th:include="include :: footer"/>
<script>
    let table;
    let form;
    layui.use(['table', 'form', 'jquery', 'popup', 'common','dtree', 'card'], function() {
        table = layui.table;
        form = layui.form;
        let $ = layui.jquery;
        let layer = layui.layer;
        let card = layui.card;
        let dtree = layui.dtree;
        let MODULE_PATH = "/system/transmitter/";
        let API_TRANSMITTER_PREFIX = "/api/transmitter/v1/";
        //树
        var DemoTree = dtree.render({
            elem: "#dataTree",//html中的id值
            type: "all",
            height:"1000",
            url:MODULE_PATH +"getStations",//url
            method:"get",
            initLevel: "2",
            icon:'2',
            firstIconArraylayui:"0",
            dataFormat: "list", //配置data的风格为list
            checkbar: true,
            checkbarType: "only",//显示半选中状态
            success:function (data) {
            },
            checkbarFun:{
                chooseDone: function(checkbarNodesParam) {//点击复选框的事件
                    var datas=dtree.getCheckbarNodesParam("dataTree");
                    var data=[];
                    for (let i = 0; i < datas.length; i++) {
                        var parentNode = dtree.getParam(DemoTree, datas[i].parentId)
                        if(parentNode.checked==1){
                        }else{
                            data.push(datas[i].nodeId);
                        }
                    }
                    $("#myTable").empty();
                    getTransmiters(data)
                }
            }
        });
        function getTransmiters(stationCode) {
            $.ajax({
                url: MODULE_PATH + "getTransmitter?stationCode=" + stationCode,//url
                dataType: 'json',
                type: 'get',
                success: function (result) {
                    $("#LAY_Images").empty();
                    var array = new Array();
                    $.each(result.data, function (index, item) {
                        var obj = {
                            "id": index+1,
                            "image": "../../admin/images/fsj.jpg",
                            "title": item.transName,
                            "remark": getName(item.status),
                            "time":"几秒前",
                            "stationCode":item.stationCode,
                            "transCode":item.transCode
                        };
                        array.push(obj);
                    })
                    card.render({
                        elem: '#currentTableId',
                        data:  array, // 静态数据
                        page: true, // 是否分页
                        limit: 8, // 每页数量
                        linenum: 4, // 每行数量
                        clickItem: function (data) { // 单击事件
                            previewImg(data.stationCode,data.transCode)
                        }
                    })
                    form.render($('#LAY_Images'));
                }
            })
        }

        // 监听搜索操作
        form.on('submit(data-search-btn)', function(data) {
            queryJson = data.field;
            card.reload("currentTableId", {
                where: queryJson,
            });
            return false;
        });
        form.on('submit(data-checked-btn)', function() {
            var data = card.getChecked("currentTableId");
            layer.msg(JSON.stringify(data));
            return false;
        });
        form.on('submit(data-btn)', function() {
            var data = card.getAllData("currentTableId");
            layer.msg(JSON.stringify(data));
            return false;
        });
    })
    let cols = [
        [
            {
                title: '故障ID',
                field: 'alarmId',
                align: 'center'
            },
            {
                title: '台站ID',
                field: 'stationCode',
                align: 'center'
            },
            {
                title: '发射机ID',
                field: 'transCode',
                align: 'center'
            },
            {
                title: '故障开始时间',
                field: 'start_time',
                align: 'center',
                templet: "<div>{{layui.util.toDateString(d.start_time)}}</div>"
            },
            {
                title: '故障结束时间',
                field: 'endTime',
                align: 'center',
                templet: "<div>{{layui.util.toDateString(d.endTime)}}</div>"
            },
            {
                title: '故障类型',
                field: 'exceptionCode',
                align: 'center',
            },
            {
                title: '故障级别',
                field: 'exceptionLevel',
                align: 'center',
            },
            {
                title: '状态数据值',
                field: 'exceptionData',
                align: 'center',
            },
            {
                title: '故障上报时间',
                field: 'sendTime',
                align: 'center',
                templet: "<div>{{layui.util.toDateString(d.sendTime)}}</div>"
            }
        ]
    ]

    function getName(value){
        let name = "未知";
        if(value==0){
            name = "空闲";
        }else if(value==1){
            name = "空闲";
        }else if(value==2){
            name = "空闲";
        }
        return name;
    }
    function previewImg(stationCode,transCode) {
        table.render({
            elem: '#myTable',
            url: '/system/transmitterexception/getExceptionsRedis',
            page: true,
            cols: cols,
            skin: 'line',
            defaultToolbar: [],
            cellMinWidth: 'auto',
            where:{
                "stationCode":stationCode,
                "transCode":transCode
            },
            done: function (res, curr, count) {
            },
            response: {
                statusName: 'code',//规定数据状态的字段名称，默认：code
                statusCode: 200, //规定成功的状态码，默认：0
                msgName: 'msg', //规定状态信息的字段名称，默认：msg
                countName: 'count', //规定数据总数的字段名称，默认：count
                dataName: 'data' //规定数据列表的字段名称，默认：data
            }
        });
    }
</script>
</html>
